/*
 * overlay 테스트.
 */
Ext.setup({
	tabletStartupScreen:"./tabletStartupScreen.png",
	phoneStartupScreen:"./phoneStartupScreen.png",
	tabletIcon:"./tabletIcon.png",
	phoneIcon:"./phoneIcon.png",
	glossOnIcon: true,
	statusBarStyle:"black",
	fullscreen:true,
	preloadImages:[],
	scope:this,
	onReady: function() {
		var panel = new Ext.Panel({
			fullscreen:true,           
			layout: {
				type: 'vbox',
                pack: 'center'
            },
            dockedItems: [ {
                     dock : 'top',
                     xtype: 'toolbar',
                     title: 'Overlay Sample1'
            } ],
            items: [{
                xtype: 'button',
                text: 'Launch Overlay',
                handler: function() {
                    if (!this.popup) {
                        this.popup = new Ext.Panel({
                            // 말그대로 화면에 띄우게 됩니다.
                            floating: true,
                            // 일반적으로 모달과 모달리스가 있는데, sencha에서도
                            // modal로 띄울수 있군요. 모달의경우 보시는것처럼
                            // 모달로 띄워진상태에서 아래 내용이 선택되지 않도록 할때 사용합니다.
                            modal: true,
                            // 중앙에 나오도록~
                            centered: true,
                            width: 250,
                            height:250,
                            styleHtmlContent: true,
                            html: '<p>This is a modal, centered and floating panel. hideOnMaskTap is true by default so ' +
                                  'we can tap anywhere outside the overlay to hide it.</p>',
                            dockedItems: [{
                            	xtype: 'toolbar',
                            	dock: 'top',
                                title: 'Overlay Title'
                            }],
                            scroll: 'vertical'
                        });
                    }
                    this.popup.show('pop');
                }
            }]
        });
    }
});